<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">

<ui:composition template="template.xhtml">
	<ui:define name="title">Cadastro Usuários</ui:define>
	<ui:define name="content">
		<div id="page-heading"><h1>Usuário</h1></div>
		<table border="0" width="100%" cellpadding="0" cellspacing="0" id="content-table">
			<tr>
				<th rowspan="3" class="sized"><img src="images/shared/side_shadowleft.jpg" width="20" height="300" alt="" /></th>
				<th class="topleft"></th>
				<td id="tbl-border-top">&nbsp;</td>
				<th class="topright"></th>
				<th rowspan="3" class="sized"><img src="images/shared/side_shadowright.jpg" width="20" height="300" alt="" /></th>
			</tr>
			<tr>
				<td id="tbl-border-left"></td>
				<td>
					<!--  start content-table-inner -->
					<div id="content-table-inner">
					<h:form>
						<table border="0" width="100%" cellpadding="0" cellspacing="0">
							<tr valign="top">
								<td>			
									<!--  start step-holder -->
									<div id="step-holder">
										<div class="step-no">1</div>
										<div class="step-dark-left"><a href="">Cadastrar Usuário</a></div>
										<!-- div class="step-dark-right">&nbsp;</div>
										<div class="step-no-off">2</div>
										<div class="step-light-left">Salvar</div>
										<div class="step-light-round">&nbsp;</div>
										<div class="clear"></div-->
									</div>
									<!--  end step-holder -->					
									
									<!-- start id-form -->
									<table border="0" cellpadding="0" cellspacing="0"  id="id-form">
									<tr>
										<th valign="top">Nome Usuario:*</th>
										<td>
											<h:inputText styleClass="inp-form" id="nome" value="#{usuarioBean.nome}" required="true" requiredMessage="Campo Obrigatório" ></h:inputText>
										</td>
										<td>
											<h:message for="nome" errorClass="error-inner" showDetail="true" showSummary="false"/>
										</td>
									</tr>
									<tr>
										<th valign="top">Login:*</th>
										<td>
											<h:inputText styleClass="inp-form" id="login" value="#{usuarioBean.login}" required="true" requiredMessage="Campo Obrigatório"></h:inputText>
										</td>
										<td>						
											<h:message for="login" errorClass="error-inner" showDetail="true" showSummary="false" ></h:message>
										</td>
									</tr>	
									<tr>
										<th valign="top"><h:outputText value="Senha:*"></h:outputText></th>
										<td>											
											<h:inputSecret styleClass="inp-form" id="senha" value="#{usuarioBean.senha}" binding="#{usuarioBean.senhaValidation}" required="true">
												<f:validateLength minimum="5"></f:validateLength>
											</h:inputSecret>
										</td>
										<td>						
											<h:message for="senha" errorClass="error-inner" showDetail="true"  showSummary="false" ></h:message>
										</td>
									</tr>	
									<tr>
										<th valign="top"><h:outputText value="Confirmar Senha:"></h:outputText></th>	
										<td>											
											<h:inputSecret styleClass="inp-form" id="confirmarsenha" value="#{usuarioBean.confirmarsenha}" required="true" validator="#{usuarioBean.validaSenhas}">
												<f:validateLength minimum="5"></f:validateLength>
											</h:inputSecret>
										</td>
										<td>						
											<h:message for="confirmarsenha" errorClass="error-inner" showDetail="true" showSummary="false" ></h:message>
										</td>
									</tr>	
									<tr>
										<th valign="top">Email:*</th>
										<td>
											<h:inputText styleClass="inp-form" id="email" value="#{usuarioBean.email}" required="true" validatorMessage="Email Inválido">												
												<f:validator validatorId="emailUsuarioExistente">
													<f:param name="emailatual" value="#{usuarioBean.email}"></f:param>
												</f:validator>												
												<f:validateRegex pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{1,3})+$" ></f:validateRegex>	                							
											</h:inputText>
										</td>
										<td>						
											<h:message for="email" errorClass="error-inner" showDetail="true" showSummary="false" >
											</h:message>
										</td>
									</tr>	
									<tr>
										<th valign="top">Ativo:*</th>
										<td>
											<h:selectOneRadio value="#{usuarioBean.ativo}"  layout="lineDirection" dir="ltr" required="true" requiredMessage="Campo Obrigatório">
												<f:selectItem itemLabel="Não" itemValue="0" itemDescription="Sim"> </f:selectItem>
												<f:selectItem itemLabel="Sim" itemValue="1" itemDescription="Não"> </f:selectItem>
											</h:selectOneRadio>
										</td>
										<td>					
											
										</td>
									</tr>	
	
									<tr>
										<th>&nbsp;</th>
										<td valign="top">
											<h:inputHidden id="id" value="#{usuarioBean.idUsuario}" binding="#{idUsuario}"></h:inputHidden>											
											<h:commandButton action="#{usuarioBean.Salvar}" styleClass="form-submit" type="submit" value="Enviar"></h:commandButton>
											<a href="usuario_list.xhtml" class="form-cancel">cancel</a>
										</td>
										<td></td>
									</tr>
								</table>
							<!-- end id-form  -->
								</td>
								<td></td>
							</tr>
							<tr>
								<td><img src="images/shared/blank.gif" width="695" height="1" alt="blank" /></td>
								<td></td>
							</tr>
						</table>
					</h:form>		 
					<div class="clear"></div>
					</div>
					<!--  end content-table-inner  -->
				</td>
				<td id="tbl-border-right"></td>
			</tr>
			<tr>
				<th class="sized bottomleft"></th>
				<td id="tbl-border-bottom">&nbsp;</td>
				<th class="sized bottomright"></th>
			</tr>
		</table>		
		<div class="clear">&nbsp;</div>		
	</ui:define>
</ui:composition>
</html>